<template>
  <!-- 新增窗口 -->
  <a-modal v-model:visible="visible" title="新增客户信息" @ok="execAdd">
    <a-form
      :model="addObj"
      :label-col="{ span: 5 }"
      :wrapper-col="{ span: 14 }"
    >
      <a-form-item label="客户编号">
        <a-input v-model:value="addObj.cus_id" />
      </a-form-item>
      <a-form-item label="客户名称">
        <a-input v-model:value="addObj.cus_name" />
      </a-form-item>
      <a-form-item label="客户备注">
        <a-textarea v-model:value="addObj.cus_remark" :rows="3" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
import {ref,reactive} from 'vue'
import {post,tip} from '@/common'

export default {
  // emit是一个函数，用于子组件向父组件发射事件
  setup(props,{emit}) {

    //新增
    const addObj = reactive({
      cus_id: "",
      cus_name: "",
      cus_remark: "",
    });
    const visible = ref(false);//窗口是否显示
    const openAdd = () => {
      //打开窗口
      visible.value = true;
    };
    const execAdd = () => {
      //执行新增
      post("/info/customer", addObj).then((res) => {
        addObj.cus_id = "";
        addObj.cus_name = "";
        addObj.cus_remark = "";
        visible.value = false;
        tip.success("新增客户成功！");
        
        //通知父组件执行更新页面方法
        emit("ok");//向父组件发射一个名称为ok的事件，此事件表示新增完成
      });
    };

    return {
      //声明数据和方法
      addObj,
      visible,
      openAdd,
      execAdd
    };
  },
};
</script>
<style scoped>
</style>
